<template>
  <div class="container">
    <Search @submit="getData" />
    <Overview ref="OverviewRef" />
    <Echart v-if="state.type != 3" ref="EchartRef" />
    <!-- <Table v-else :tableData="state.ErrorDetail" @submit="getData(3,state.params)" /> -->
  </div>
</template>

<script setup lang="ts">
import Search from './components/Search'
import Overview from './components/Overview'
import AutoChart from './components/Echart'
import Echart from './components/Echart'
import Table from './components/Table.vue'

import { getStatisticsAutoMakeFriend, getStatisticsMakeGroupFriend, getStatisticsUnlimitedSend, getStatisticsGroupChatNotice, getOverview } from '@renderer/ajax/api/dataDashboards'
import { reactive, ref, nextTick } from 'vue'

const state = reactive({
  type: 3, // 0自动添加好友 1加群好友 2无限群发 3发布群公告
  ErrorDetail: [],
  params: {}
})
const OverviewRef = ref<any>(null)
const EchartRef = ref<any>(null)

const getData = async (type: any, v: any) => {
  state.type = type
  state.params = v
  let params = v
  switch (type) {
    case 0:
      getStatisticsAutoMakeFriend(params).then((res: any) => {
        OverviewRef.value.onState(0, res.Overview)
        EchartRef.value.onState(0, res)
      })
      break
    case 1:
      getStatisticsMakeGroupFriend(params).then((res: any) => {
        OverviewRef.value.onState(1, res.Overview)
        EchartRef.value.onState(1, res)
      })
      break
    case 2:
      getStatisticsUnlimitedSend(params).then((res: any) => {
        OverviewRef.value.onState(2, res.Overview)
        EchartRef.value.onState(2, res)
      })
      break
    case 3:
      getStatisticsGroupChatNotice(params).then((res: any) => {
        OverviewRef.value.onState(3, res.Overview)
        // EchartRef.value.onState(3, res)
        state.ErrorDetail = res.ErrorDetail
      })
      break
    case 4:
      let obj = {
        FilterTimeBetween: [params.StartDate, params.EndDate]
      }
      getOverview(obj).then((res: any) => {
        OverviewRef.value.onState(4, res)
        EchartRef.value.onState(4, res)
      })
      break
  }
}
</script>

<style scoped lang="scss">
.container {
  background: #fff;
}
</style>
